<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>游服科技官网</title>
	<meta name="author" content="Alvaro Trigo Lopez" />
	<meta name="description" content="fullPage plugin by Alvaro Trigo. Pure javascript version of full screen slider." />
	<meta name="keywords"  content="fullpage,jquery,alvaro,trigo,plugin,fullscren,screen,full,iphone5,apple,pure,javascript,slider,hijacking" />
	<meta name="Resource-type" content="Document" />


	<link rel="stylesheet" type="text/css" href="../css/javascript.fullPage.css" />
	<link rel="stylesheet" type="text/css" href="../bootstrap-3.3.7/css/bootstrap.css" />
	<link rel="stylesheet" type="text/css" href="../css/yfu.css" />

	<style>

		.index_goods :hover {
			cursor:pointer;
		}
</style>
</head>
<body>

<!-- 顶部导航 -->
<div class="headerpage"></div>


<div id="fullpage">
	<div class="section " id="section0">
		<div class="slide" id="slide1">
			<div class="content">
				<img src="../images/sy.jpg" /> 
			</div>
		</div>
		<div class="slide" id="slide2">
			<div class="content">
				<img src="../images/sy1.jpg" /> 
			</div>
		</div>
		<div class="slide" id="slide2">
			<div class="content">
				<img src="../images/sy.jpg" />
			</div>
		</div>
		
	</div>
	<div class="section" id="section1">
		<div class="content" style="width:100%;height:100%;background-image: url(../images/intro.jpg);background-size:cover">
			
			<div class="row center-vertical">
			  <div class="col-md-5">
			  	<img src="../images/introimg.jpg" style="width:80%;"/>
			  </div>
			  <div class="col-md-7">
			  	<div style="height:50px"></div>
			  	<div id="introtext" class="introtext-first" style="text-align: left;">
			  		<span class="white-color font25">公司介绍</span>
				  	<br />
				  	<span class="graycolor">introduction</span>
				  	<br/><br/>
				  	<div  class="font20 white-color" style="width:500px;" id="companyBrief">
					</div>
			  	</div>
			  </div>
			</div>
		</div>
	</div>
	<div class="section" id="section2">
		<div class="content"  style="width:100%;height:100%;background-image: url(../images/bg1.jpg);background-size:cover">
			<div  style="padding-top:20% ;" >
				<div></div>
				<div class="row"  id="index_goods_list">
					<div class="col-md-3" style="text-align: center;">
						<div style="position:relative;width:400px;height:300px;" class="index_goods">
							<img src="../images/1.jpg"  style="height: 300px;width:400px"/>
							<div  style="position:absolute;width:100%;height:50px;z-indent:2;left:0;top:250px;background-color: #00000077;font-size:20px;line-height: 50px">
								文字
							</div>
						</div>
					</div>
					<div class="col-md-3" style="text-align: center;">
						<img src="../images/1.jpg"  style="height: 300px;width:400px"/>
					</div>
					<div class="col-md-3" style="text-align: center;">
						<img src="../images/1.jpg"  style="height: 300px;width:400px"/>
					</div>
				</div>

			</div>
		</div>
	</div>
	<div class="section" id="section2">
		<div class="content"  style="width:100%;height:100%;background-image: url(../images/contact.jpg);background-size:cover">
			
			<div class="row center-vertical">
			  <div class="col-md-5">
			  	<img src="../images/contact_img.png" />
			  </div>
			  <div class="col-md-7">
			  	
			  	<div id="contracttext" class="margin200" style="margin-top: 50px;text-align: left;">
			  		<span class="white-color font25">联系我们</span>
				  	<br />
				  	<span class="graycolor">CONTACT US</span>
				  	<br/><br/>
				  	<div  class="font20 white-color">
						企业电话：<span id="mobile"></span><br/><br/>
						企业邮箱：<span id="email"></span><br/><br/>
						公司地址：<span id="address"></span><br/><br/>
					</div>
			  	</div>
			  </div>
			</div>
		</div>
	</div>
	
</div>

<script type="text/javascript" src="../js/jquery-2.0.3.js"></script>
<script type="text/javascript" src="../js/javascript.fullPage.js"></script>
<script type="text/javascript" src="../js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="../bootstrap-3.3.7/js/bootstrap.js"></script>
<script type="text/javascript" src="../js/ZoomPic.js"></script>
<script src="../js/layer/layer.js"></script>
<script type="text/javascript" src="../js/request.js"></script>
<script type="text/javascript">
$(function () {
    $(".headerpage").load("header.html");
	//全屏滑动
	fullpage.initialize('#fullpage', {
		anchors: ['firstPage', 'secondPage', '3rdPage', '4thpage', 'lastPage'],
		menu: '#menu',
		css3:true,
		navigation: true,
		navigationPosition: 'left',
		navigationColor:'#fff',
		onLeave: function(index, nextIndex , direction ) {
			if(index == 1 && direction == 'down') {
				introAppear();
			} 
			if(index == 2 && direction == 'up') {
				introDisappear();
			} 
			if(index == 2 && direction == 'down') {
				introDisappear();
			} 
			if(index == 3 && direction == 'up') {
				introAppear();
			} 
			if(index == 3 && direction == 'down') {
				contactAppear();
			} 
			if(index == 4 && direction == 'up') {
				contactDisappear();
			} 
		}
	});
	//3d旋转
//	new ZoomPic("jswbox");

	function contactAppear () {
		$("#contracttext").removeClass("textright")
		$("#contracttext").addClass("textleft")
		$("#contracttext").removeClass("margin200")
	}
	function contactDisappear () {
		$("#contracttext").removeClass("textleft")
		$("#contracttext").addClass("textright")
	}
	
	function introAppear () {
		$("#introtext").removeClass("introtextright")
		$("#introtext").addClass("introtextleft")
		$("#introtext").removeClass("introtext-first")
	}
	function introDisappear () {
		$("#introtext").removeClass("introtextleft")
		$("#introtext").addClass("introtextright")
	}

	// 查询公司介绍
    $.ajaxHttp({
        url: '/web/company/getEntityById',
        type: 'POST',
        json: true,
        mask: true, //是否有loading,
        data: {
            id: 1
        }
    }).then(function(data){
//        layer.msg("操作成功");
        // 成功回调，data是成功回调参数
        console.log(data)
        $("#companyBrief").text(data.gwCompanyBrief)
        $("#mobile").text(data.gwCompanyPhone)
        $("#address").text(data.gwCompanyAddress)
        $("#email").text(data.gwCompanyEmail)
    }, function(err){
        console.log(err);
        // 错误回调，err是错误回调参数
        // 这里不处理错误也可以，上面都有集中处理错误，会tips
    })


    query(1);
    function query(currentPage) {
        $.ajaxHttp({
            url: '/web/product/listByPage',
            type: 'POST',
            json: true,
            mask: true, //是否有loading,
            data: {
                currentPage: currentPage,
                pageSize: 10
            }
        }).then(function(data){
//        layer.msg("操作成功");
            // 成功回调，data是成功回调参数
            console.log(data)
            $("#index_goods_list").html('');
            var content = '<div class="col-md-1"></div>';
            for (var i = 0; i < data.list.length; i++) {
                var con = data.list[i]
                content += '<div class="col-md-3" onclick="toDetail(' + con.id +')" style="text-align: center;">' +
                    '<div style="position:relative;width:400px;height:300px;" class="index_goods">' +
                    '<img src="'+ con.fileFtpPath + '"  style="height: 300px;width:400px"/>' +
                    '<div  style="position:absolute;width:100%;height:50px;z-indent:2;left:0;top:250px;background-color: #00000077;font-size:20px;line-height: 50px">' +
                    con.gwProductName +
                    '</div> </div></div>';
            }
            $("#index_goods_list").html(content);
            totals = data.totals;
        }, function(err){
            console.log(err);
            // 错误回调，err是错误回调参数
            // 这里不处理错误也可以，上面都有集中处理错误，会tips
        })
    }
})
function toDetail(goodId) {
    window.location.replace("goodsIntro.html?productId=" + goodId);
}

</script>
</body>
</html>
